<template>
  <div class="rent">
    <el-table :data="tableData" ref="table" border style="width: 100%">
        <el-table-column fixed width="160" prop="orderNo" label="订单号"></el-table-column>
        <el-table-column width="170" label="下单时间">
            <template slot-scope="scope">
                <div>{{ tableFormatDate(scope.row.startTime) }}</div>
            </template>
        </el-table-column>
        <el-table-column min-width="150" prop="gameName" label="趣游戏用户">
            <template slot-scope="scope">
                <p class="table-btn" @click="goUserDetail(scope.row.userId )" v-if="scope.row.userId">趣ID：{{ scope.row.userId }}</p>
                <p>昵称：{{ scope.row.userName }}</p>
            </template>
        </el-table-column>
        <el-table-column min-width="150" label="匹配账号">
            <template slot-scope="scope">
                <p class="table-btn" @click="goDetail(scope.row.accountNo, scope.row.userId)">QQ：{{ scope.row.accountNo }}</p>
                <p>昵称：{{ scope.row.roleName }}</p>
                <p>区服：{{ scope.row.serverName }}</p>
                <p class="table-btn" @click="goUserDetail(scope.row.accountUser )">号主趣ID：{{ scope.row.accountUser }}</p>
            </template>
        </el-table-column>
        <el-table-column min-width="120" label="体验时长" prop="time"></el-table-column>
        <el-table-column min-width="150" label="状态">
            <template slot-scope="scope">
                <span v-if="scope.row.status === 0" style="color:#67C23A;">体验中</span>
                <span v-if="scope.row.status === 1">待结算</span>
                <span v-if="scope.row.status === 2">已完成</span>
                <span v-if="scope.row.status === 3" style="color:#F56C6C;">待罚款</span>
            </template>
        </el-table-column>
        <el-table-column min-width="100" label="优惠">
            <template slot-scope="scope">
                <div v-if="scope.row.couponPrice">{{ scope.row.couponPrice }} 趣宝石</div>
                <div v-else>-</div>
            </template>
        </el-table-column>
        <el-table-column min-width="150" label="违规" prop="status">
            <template slot-scope="scope">
                <p v-for="(item, index) in scope.row.punishDesc" :key="index">
                    {{ item }}
                </p>
                <p v-if="scope.row.punishDesc.length === 0">-</p>
            </template>
        </el-table-column>
        <el-table-column min-width="120" label="实付">
            <template slot-scope="scope">
                <div v-if="scope.row.hasApply">{{ scope.row.hasApply }} 趣宝石</div>
                <div v-else>-</div>
            </template>
        </el-table-column>
        <el-table-column min-width="120" label="号主所得">
            <template slot-scope="scope">
                <div v-if="scope.row.userGetCoin">{{ scope.row.userGetCoin | numInitW }} 趣金币</div>
                <div v-else>-</div>
            </template>
        </el-table-column>
        <el-table-column min-width="120" label="平台收益">
            <template slot-scope="scope">
                <div v-if="scope.row.platformCoin">{{ scope.row.platformCoin | numInitW }} 趣金币</div>
                <div v-else>-</div>
            </template>
        </el-table-column>
        <el-table-column min-width="120" label="处理结果">
            <template slot-scope="scope">
                <p v-for="(item, index) in scope.row.dealResult" :key="index">
                    {{ item }}
                </p>
                <p v-if="scope.row.dealResult.length === 0">-</p>
            </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作">
            <template slot-scope="scope">
                <el-button @click="goOrderDetail(scope.row)" type="text" size="small">查看详情</el-button>
            </template>
        </el-table-column>
    </el-table>
    <div class="tools">
      <el-pagination
          @size-change="sizeChange"
          @current-change="pageChange"
          :current-page="pageNum"
          :page-sizes="_pageSizes"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
  </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
    }
  }
}
</script>
<style lang="scss" scoped></style>
